<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>导航栏菜单的设计与实现</title>
        <style>
            ul {
                list-style: none;
                padding: 0;
            }		
            li {
                float: left;
            }
            a:link, a:visited {
                display: block;
                width: 100px;
                font-weight: bold;
                color: white;
                background-color:deepskyblue;
                text-align: center;
                padding: 5px;
                text-decoration: none;
            }
            a:hover, a:active {
                background-color:darkblue;
            }
        </style>
    </head>
    <body>
        <h3>导航栏菜单的设计与实现</h3>
        <hr/>
        <nav>
            <ul>
                <li><a href="#">头条</a></li>
				<li><a href="#">娱乐</a></li>
                <li><a href="#">热点</a></li>
                <li><a href="#">体育</a></li>
                <li><a href="#">财经</a></li>
                <li><a href="#">科技</a></li>
            </ul>
        </nav>
    </body>
</html>